@import "../../css/xyybase";
body{
  background-color: #f5f5f5;
}

section {
  width: 1200px!important;
  margin-top: 20px!important;
  .order-msg{
    background-color: #fff;
    margin-bottom: 10px;
    padding:40px 40px;

    .order-wait{
      border-bottom: 1px dashed @address-list-border-color;
      padding-bottom: 20px;
      &>.order-ok{
        float: left;
        display: inline-block;
        width: 45px;
        height: 45px;
        background-image: url("../img/ok.png");
        background-repeat: no-repeat;
        background-size: contain;
      }
      &>ul{
        margin-left: 52px;

        float: left;
        & li .order-fold .icons{
          display:inline-block;
          width: 13px;
          height: 8px;
          background: url('../img/xq.png') no-repeat center;
        }
        & li .order-fold .icons.active{
          //background: url('../img/xq-light.png') no-repeat center;
        }
        & li{
          &>.order-fold:hover{
            color: @baseColor;
          }
          &>.order-fold:hover .icons{
            background: url('../img/xq-light.png') no-repeat center;
            transition: all linear .5s;
          }

        }
      }
      &>div{
        float: right;
      }
    }
    .zdie{
      margin: 30px 30px 40px 100px;
      &>.item-zdie{
        //flex-direction: row;
        margin-bottom: 14px;
        &>.zdie-inner{


        }
      }
      & .zdie-header{

        font-size: @inner-font-size;
        color: @font-last-color;
        font-weight: bold;
        margin-right: 10px;
      }


    }
  }
//  支付方式
  .pay-moment{
    background-color: #fff;
    padding: 35px 40px;
    margin-bottom: 10px;
    &>p{
      padding-bottom: 18px;
      border-bottom: 1px solid @address-list-border-color;
    }
    &>.pay-moment-body{
      width: 100%;
      margin-top: 20px;
      padding-bottom: 30px;
      border-bottom: 1px solid #e8e8e8;
    }
    &>.pay-moment-body li{
      border: 1px solid @address-list-border-color;
      float: left;
      height: 60px;
      width: 168px;
    &:hover{
      border: 1px solid @baseColor!important;
    }
      &>img{
        display: block;
        margin: 0 auto;
        max-width: 100%;
      }
    }
    &>.pay-moment-body li:not(:first-child){
      margin-left: 20px;
    }
    .pay-detail{
      margin-top: 20px;
      &>p{
        margin-bottom: 14px;
        &>input[type="password"]{
          width: 280px;
          height: 30px;
          outline: none;
          border: none;
          border: 1px solid @address-list-border-color;
          padding-left: 10px;
        }
        &>input[type="button"],&>input[type="submit"]{
          outline: none;
          border: none;
          width: 100px;
          height: 36px;
          color: #fefefe;
          font-size: @header-font-size;
          background-color: @baseColor;
          border-radius: 6px;

        }
        &>a{
          font-style: normal;
          font-size: 10px;
          color: #999;
          cursor: pointer;
        }
      }
      &>p>.count-header{
        display: inline-block;
        width: 100px;
        text-align: right;
        margin-right: 10px;

      }
      &>p>.count-money{
        display: inline-block;
        width: 100px;
        text-align: left;
        font-weight: bold;
        color: @baseColor;

      }
    }
  }
}
.order-list{
  & .order-list-on{
    flex-direction: column;
    margin-left: 10px;
  }
}
// 边框的hover变色
.border-active{
  border: 1px solid @baseColor!important;

}
//orderCompletionOver
.o-ok{
  &:extend(.order-ok);
}
//.border-active
.icon-active{
  transform: rotate(180deg);
  transform-origin:50% 50%;

  -ms-transform: rotate(180deg); 		/* IE 9 */
  -ms-transform-origin:50% 50%; 		/* IE 9 */

  -webkit-transform: rotate(180deg);	/* Safari 和 Chrome */
  -webkit-transform-origin:50% 50%;	/* Safari 和 Chrome */

  -moz-transform: rotate(180deg);		/* Firefox */
  -moz-transform-origin:50% 50%;		/* Firefox */

  -o-transform: rotate(180deg);		/* Opera */
  -o-transform-origin:50% 50%;		/* Opera */


}
/*
 订单完成css样式
*/
.order-ok{
  float: left;
  display: inline-block;
  width: 45px;
  height: 45px;
  background-image: url("../img/ok.png");
  background-repeat: no-repeat;
  background-size: contain;
}
.buised{
  margin-top: 20px;
  background-color: #fff;
  padding: 50px 0;
  &>li:first-child{
    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    margin-bottom: 20px;
    .buy-over{
      margin-left: 15px;
      color: @baseColor;
      font-weight: bold;
    }
  }
  &>li:nth-child(2){
    margin-bottom: 20px;
    &>div{
      display: flex;
      flex-direction: row;
      align-content: center;
      justify-content: center;
      color: #b2b2b2;

    }

  }
  &>li:last-child{
    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    &>.buy-line{
      display: inline-block;
      background-color: @address-list-border-color;
      width: 1px;
      height: 19px;
      margin: 0 20px;
    }
  }
}
.guess-love{
  width: 100%;
  &>ul{
    width: 100%;
    &>li{
      height: 300px;
      float: left;
      background-color: #fff;
      width: 19%;
      margin-left: 1.25%;
      padding: 10px 0;
      &>img{

        display: block;
        width: 160px;
        height: 160px;
        margin: 0 auto;
        margin-top: 20px;
      }
      &>.guess-love-header{
        font-size: 14px;
        color: #333;
        margin: 10px 20px;
      }
      &>.guess-love-money{
        color: @baseColor;
        font-weight: bold;
        text-align: center;
        &>span:first-child{
          font-size: 12px;
        }
      }

    }
    &>li:first-child{
      margin-left: 0;
    }
  }
}































